<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../node_modules/jquery/dist/jquery.js"></script>
</head>
<body>
<button>按钮</button>
<script>
     $(function () {
         /**
          *jQuery中有两种绑定事件的方法
          * 1、eventName(fn)
          * 编码效率略高/部分js事件不能添加
          * 2、on(eventName,fn);
          * 编码效率略低/所有js事件都可以添加
          * 两种方法都不会被覆盖
          */
         // $("button").click(function () {
         //    alert(1)
         // });
         // $("button").click(function () {
         //     alert(2)
         // });
         // $("button").mouseleave(function () {
         //    alert("鼠标移开 mouseleave")
         // });
         // $("button").mouseenter(function () {
         //     alert("鼠标移入 mouseleave")
         // });

         $("button").on('click',function () {
             alert(1)
         });
         $("button").on('click',function () {
             alert(2)
         });
         $("button").on('mouseleave',function () {
             alert("鼠标移开 mouseleave")
         });
         $("button").on('mouseenter',function () {
             alert("鼠标移入 mouseleave")
         });
     });
</script>
</body>
</html>